<template>
  <base-content>
    <template>
      <el-main>
        <el-form ref="form" class="fp-form" :inline="true" label-width="70px">
          <el-form-item label="对账维度" prop="name">
            <el-select v-model="form.dept_type" placeholder="请选择对账维度">
              <el-option v-for="(item, index) in typeList" :key="index" :label="item.label" :value="item.value" />
            </el-select>
          </el-form-item>
          <el-form-item label="时间">
            <el-date-picker v-model="createTimes" type="datetimerange" range-separator="至" start-placeholder="开始日期" end-placeholder="结束日期" />
          </el-form-item>
          <div class="fp-form-footer pull-right">
            <div class="pull-right">
              <el-button type="default" @click="handleBaseSearch('reset')">重置</el-button>
              <el-button type="default" @click="handleBaseSearch('search')">查询</el-button>
            </div>
          </div>
        </el-form>
      </el-main>
      <el-table :data="list" border style="width: 100%">
        <el-table-column prop="dept_name" :label="accountText" />
        <el-table-column prop="report_date" label="日期" />
        <el-table-column prop="total_order_num" label="已支付订单量" />
        <el-table-column prop="total_order_amount" label="支付金额" />
        <el-table-column prop="platform_score" label="平台分成" />
        <el-table-column prop="operate_score" label="运营中心分成" />
        <el-table-column prop="consult_score" label="咨询中心分成" />
        <el-table-column prop="organize_score" label="机构分成" />
        <el-table-column prop="suggest_score" label="推荐者分成" />
      </el-table>
      <el-main>
        <el-pagination background layout="prev, pager, next" :total="total" @current-change="pageChange" />
      </el-main>
    </template>
  </base-content>
</template>

<script>
import { mapGetters } from 'vuex'
import { hasPermission, parseTime } from '@/utils'
import { plantBill } from '@/utils/config'
import { getBillTypeList, getNormalOrderReports } from '@/api/checking'
export default {
  data() {
    const account_type = JSON.parse(localStorage.getItem('userInfo')).account_type
    return {
      // here is dialog
      isShow: false,
      list: [],
      typeList: [],
      typeIds: [],
      accountText: plantBill[account_type] || '账号类型',
      typeData: { 1: '各个平台账单', 2: '各个运营中心账单', 3: '各个咨询中心账单', 4: '各个机构账单', 5: '各个门店账单' },
      form: {
        order_type: 1,
        dept_type: '',
        report_start_time: '',
        report_ent_time: ''
      },
      createTimes: [],
      total: 0,
      pageNum: 1,
      pageSize: 10,
      isHidden: false
    }
  },
  computed: {
    ...mapGetters(['sidebar']),
    routes() {
      return this.$router.options.routes
    }
  },
  async mounted() {
    const isHidden = !hasPermission('拼团管理')
    this.isHidden = isHidden
    this.queryTypes()
  },
  methods: {
    async queryTypes() {
      const result = await getBillTypeList()
      if (result.code === '0') {
        const tList = result.info.data.dept_type
        this.typeIds = tList
        this.form.dept_type = tList[0]
        const typeData = this.typeData
        const typeList = []
        tList.forEach((key) => {
          typeList.push({ value: key, label: typeData[key] })
        })
        this.typeList = typeList
        this.query({ page_size: 10, page_num: this.pageNum })
      }
    },
    async query(param) {
      const params = {
        ...this.form,
        report_start_time: this.createTimes.length > 0 ? parseTime(this.createTimes[0]) : '',
        report_ent_time: this.createTimes.length > 0 ? parseTime(this.createTimes[1]) : '',
        page_num: this.pageNum,
        page_size: this.pageSize,
        ...param
      }
      const result = await getNormalOrderReports(params)
      if (result.code === '0') {
        this.list = result.info.data
        this.total = result.info.meta.count
      }
    },
    // 分页回调
    pageChange(val) {
      this.pageNum = val
      this.query({ page_num: val })
    },
    // val: 当前表单中的数据, key 用来handles 中设置的唯一标识key值
    handleBaseSearch(key) {
      if (key === 'search') {
        this.query({ page_size: 10, page_num: this.pageNum })
      } else {
        this.form = {
          order_type: 1,
          dept_type: this.typeIds[0] || '',
          report_start_time: '',
          report_ent_time: ''
        }
        this.createTimes = []
        this.query({ page_size: 10, page_num: this.pageNum })
      }
    }
  }
}
</script>
